<template>
  <div>
    <WorkbenchHeader />
    <div>
      <Tabs default-active-key="1" @change="handleTabs" size="large">
        <Tabs.TabPane key="1" tab="出库">
          <GrowCardRu class="enter-y" />
        </Tabs.TabPane>
        <Tabs.TabPane key="2" tab="入库">
          <GrowCardChu class="enter-y" />
        </Tabs.TabPane>
      </Tabs>
    </div>
    <div class="lg:flex mt-6"> 
      <div class="enter-y w-full !mr-4 lg:w-8.4/10">
        <faAnalysis />
      </div>
      <div class="enter-y w-full lg:w-2.6/10">
        <TopList :bordered="false" />
      </div>
    </div>
  </div>
</template>
<script lang="ts" setup name="Workbench">
  import { ref } from 'vue';
  import { Card, Tabs } from 'ant-design-vue';
  import { PageWrapper } from '/@/components/Page';
  import WorkbenchHeader from './components/WorkbenchHeader.vue';
  import ProjectCard from './components/ProjectCard.vue';
  import GrowCardRu from './../analysis/components/GrowCardRu.vue';
  import GrowCardChu from './../analysis/components/GrowCardChu.vue';
  import NumbersCard from './components/NumbersCard.vue';
  import QuickNav from './components/QuickNav.vue';
  import DynamicInfo from './components/DynamicInfo.vue';
  import SaleRadar from './components/SaleRadar.vue';
  import shouAnalysis from './components/shouAnalysis.vue';
  import faAnalysis from './components/faAnalysis.vue';
  import Calendar from './components/Calendar.vue';
  import TopList from './components/TopList.vue';

  const loading = ref(true);

  setTimeout(() => {
    loading.value = false;
  }, 800);

  function handleTabs(key) {
    console.log(key);
  }
</script>
